<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport"
          content="width=device-width,user-scalable=no,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0"/>
    <meta content="telephone=no" name="format-detection"/>
    <meta http-equiv="Cache-Control" content="no-transform "/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="applicable-device" content="mobile"/>
    <title>电话号码认证</title>
    <meta name="Keywords" content=""/>
    <meta name="Description" content=""/>
    <link rel="stylesheet" type="text/css" href="/Public/home/css/ranking_2.css"/>
    <link rel="stylesheet" type="text/css" href="/Public/home/css/recharge_8.css"/>
    <link rel="stylesheet" type="text/css" href="base.css">
    <link rel="stylesheet" type="text/css" href="basephone.css">
    <script src="https://cdn.bootcss.com/jquery/2.2.1/jquery.min.js"></script>
    <style>
        html,body{
            width: 100%;
            height: 100%;
        }
        .d_phone, .d_codetxt, .d_code {
            margin-top: 10px;
            /* border-radius: 15px; */
            padding:2px 9px;
            outline: none;
            /* border: 0px; */
            /* color: black; */
            border: 1px solid #ccc;
            margin-left: 9px;
            border-radius: 6px;
        }

        .d_phone,.d_codetxt {
            width: 80%;
        }

         {
        }

        .d_code {
            width: 20%;
        }

        .sub {
            margin-top: 5%;
        }
        .hide{
            display: none;
        }
        .ip_div1,.ip_div2{
            text-align:center;
        }
        .sub{
            width: 20%;
            margin-top: 10px;
            /* border-radius: 15px; */
            padding:2px 9px;
            outline: none;
            /* border: 0px; */
            /* color: black; */
            border: 1px solid #ccc;
            margin-left: 9px;
            border-radius: 6px;
        }
        .captchabtn{
            margin-top: 10px;
            /* border-radius: 15px; */
            padding:2px 9px;
            outline: none;
            /* border: 0px; */
            /* color: black; */
            border: 1px solid #ccc;
            margin-left: 9px;
            border-radius: 6px;
        }
        .captchabtn a{
            color:black;
        }
    </style>
    <script>
        function sendms() {
            var phone = $("#phone").val();
            if (phone == "") {
                alert("电话号码不能为空");
                return;
            }
            var pattern = /^1[34578]\d{9}$/;
            if (pattern.test(phone)) {

            } else {
                alert("联系电话格式不正确");
            }
            $.ajax({
                type: "GET",
                url: "/Home/User/veriphonesendms",
                datatype: 'JSON',
                data:{'phone':phone},
                success: function (response) {
                    console.log(response.message);
                    var time = 60;
                    function timeCountDown() {
                        if (time == 0) {
                            clearInterval(timer);
                            $("#send").show();//启用按钮	removeClass
                            $("#wait").addClass('hide');
                            return true;
                        }
                        $("#send").hide();
                        $('#wait').text(time + "秒后重发");
                        $("#wait").removeClass('hide');
                        time--;
                        return false;
                    }
                    $("#send").attr("disabled", "true");
                    timeCountDown();
                    var timer = setInterval(timeCountDown, 1000);

                },
                error: function () {
                },
                complete: function () {
                    //hideLoading()
                }
                //  "json");
            });
        }
    </script>
</head>
<body style="background-color:#fff">
<div class="wrapper"><!--头部 begin -->
    <div class="wx_header">
        <div class="wx_nav_box1">
            <div class="wx_home1"><a href="/user/userinfo"><i class="back_icos"></i><em>返回</em></a></div>
            <a href="javascript:;" class="logo">电话号码认证</a></div>
    </div><!--头部 end -->
</div>
<div style="width:100%;background-color: white;display: block;margin: 0 auto">
    <if condition="($havephone eq 1) ">
        <div>
            已认证号码{$phone}
        </div>

        <elseif condition="$name eq 2"/>
    </if>

    <form action="/Home/User/phoneAuth" method="post">


        <div class="ip_div1">
            手机号：<input name="phone" id="phone" class="d_phone" type="text" value="18701734813" placeholder="请填写电话号码"/>
        </div>
        <div class="ip_div2">
            验证码：<input name="vericode" id="vericode" class="d_codetxt" type="text" placeholder="验证码"/>


        </div>
        <div style="width:100%; text-align:center;">
            <span class="captchabtn"><a href="javascript:void(0);" class="btn" id="send" onclick="sendms()">发送验证码</a><span class="txt hide" id="wait">60秒后重发</span></span>
            <input class="sub" type="submit"/>
        </div>
    </form>
</div>
</body>
</html>